{{extend './head.html'}}
{{block 'content'}}
<div class="shopcard">
    <h3 class="shopcard-h3">我的购物车</h3>
    <div class="shopcard-both">
        <ul style="margin-top: 40px;">
            {{each data}}
            <li class="table-li">
                <h4 sid="{{$value.id}}" id="shoph4">{{$value.username}}:用户的订单<button type="button" class="layui-btn delshop" style="position: relative;left: 10px;">删除订单</button></h4>
                <table class="table table-hover table-warning" valign="button" id="list-table"
                    style="background-color: #eeeeee">
                    <thead>
                        <tr>
                            <th scope="col" style="width:5%; ">编号</th>
                            <th scope="co1" style="width:10%">名称</th>
                            <th scope="co1" style="width:10%">价格</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{each $value.comm}}
                        <tr class="" valign="middle">
                            <th scope="row">{{$index+1}}</th>
                            <td>{{$value.name}}</td>
                            <td>${{$value.number}}</td>
                        </tr>
                        {{/each}}
                    </tbody>
                </table>
            </li>
            {{/each}}
        </ul>
    </div>
</div>
{{/block}}
{{block 'contentcss'}}
<style>
    * {
        padding: 0px;
        margin: 0px;
    }

    .shopcard {
        margin: 0px auto;
        width: 980px;
    }

    .shopcard-h3 {
        text-align: center;
        margin-top: 10px;
    }

    .shopcard-both {
        border-top: 3px solid #bbbbbb;
    }

    .table-li {
        margin: 20px auto;
    }
</style>
{{/block}}
{{block 'contentjs'}}
<script>
    $('.delshop').on('click', function (e) {
        if (confirm('是否取消订单')) {
            $.ajax({
                type: "get",
                url: "/api/delcard?id="+$(e.target).parent().attr('sid'),
                success: function (res) {
                    if (res.flog) {
                        layer.msg('删除订单成功', { icon: 6 });
                        $(e.target).parent().parent().remove()
                    } else {
                        layer.msg('删除订单失败!', { icon: 5, time: 1000 });
                    }
                },
                error: function (err) {
                    // layer.msg('程序异常!', { icon: 5, time: 1000 });
                }
            });
        }
    })
</script>
{{/block}}